<style>
    * {
        font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft YaHei UI";
    }

    .panel-default > .panel-body {
        /*background-color: #354a5f;*/
    }

    .panel-default > .panel-heading h3 :hover {
        color: #f2f2f2;
    }
</style>
<div class="container">
    <div class="row">
        <div class="col-md-11 com-md-offset-1">
            <div class="well">
                <div class="row">
                    <div class="col-md-4">
                        <a ui-sref="p1" class="thumbnail">
                            <img src="image/mm_001.jpg" alt="...">
                        </a>

                        <button ui-sref="p1" class="btn btn-success" style="width: 100%; padding: 3%; margin-bottom: 5%">TICKET</button>
                    </div>
                    <div class="col-md-6">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h2 class="panel-title" style="font-size: 2em">The Movie Name</h2>
                            </div>
                            <div class="panel-body">
                                <ol class="breadcrumb">
                                    <li><a href="#">USA</a></li>
                                    <li><a href="#">Risk</a></li>
                                    <li class="active">2016</li>
                                </ol>
                                <div class="row">
                                    <div class="col-md-3">Rating</div>
                                    <div class="col-md-6">
                                        <my-rating></my-rating>
                                    </div>
                                </div>
                                <ul class="list-group">
                                    <li class="list-group-item">
                                        <div class="row">
                                            <div class="col-md-3">Director</div>
                                            <div class="col-md-6">
                                                Director
                                            </div>
                                        </div>
                                    </li>
                                    <li class="list-group-item">
                                        <div class="row">
                                            <div class="col-md-3">Scenarist</div>
                                            <div class="col-md-6">
                                                Zach John
                                            </div>
                                        </div>
                                    </li>
                                    <li class="list-group-item">
                                        <div class="row">
                                            <div class="col-md-3">Country & Area</div>
                                            <div class="col-md-6">
                                               USA
                                            </div>
                                        </div>
                                    </li>
                                    <li class="list-group-item">
                                        <div class="row">
                                            <div class="col-md-3">Product</div>
                                            <div class="col-md-6">
                                                Sony Inc.
                                            </div>
                                        </div>
                                    </li>
                                    <li class="list-group-item">
                                        <div class="row">
                                            <div class="col-md-3">More titles</div>
                                            <div class="col-md-6">
                                                Amazing Fantastic Exciting
                                            </div>
                                        </div>
                                    </li>
                                    <li class="list-group-item">
                                        <div class="row">
                                            <div class="col-md-3">Actors</div>
                                            <div class="col-md-6">
                                                <ol class="breadcrumb">
                                                    <li><a href="#">Jack</a></li>
                                                    <li><a href="#">Rose</a></li>
                                                    <li class="active">Tom</li>
                                                </ol>
                                            </div>
                                        </div>
                                    </li>
                                </ul>

                                <div class="panel panel-default">
                                    <div class="panel-heading">Story</div>
                                    <div class="panel-body">
                                        Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.
                                    </div>
                                </div>

                            </div>
                            <div class="panel-footer">Panel footer</div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>